<template>
  <div id="list-box" class="component-wrap">
    <van-swipe-cell :right-width="60" :disabled="deleteShow">
      <div class="box box-shadow">
        <table>
          <tr>
            <td>资产编码： </td>
            <td>{{detailItem.assetCode}}</td>
          </tr>
          <tr>
            <td>资产名称：</td>
            <td>{{detailItem.assetName}}</td>
          </tr>
          <tr>
            <td>资产大类：</td>
            <td>{{detailItem.assetType}}</td>
          </tr>
          <tr>
            <td>资产小类：</td>
            <td>{{detailItem.assetGroup}}</td>
          </tr>
          <tr>
            <td>维修金额：</td>
            <td>{{detailItem.assetMoney}}</td>
          </tr>
        </table>
        <img src="../../assets/label2_maintenance@3x.png" class="repair-status"/>
      </div>
      <p slot="right">删除</p>
    </van-swipe-cell>
  </div>
</template>

<script type="text/ecmascript-6">
  import { SwipeCell } from 'vant';

  export default {
    name: "repairList",
    props: [ "detailItem", "deleteShow" ]
  }
</script>

<style scoped>
  .box {
    position: relative;
  }
  .repair-status {
    position: absolute;
    top: 0;
    right: 0;
    width: 4rem;
  }
  .van-swipe-cell__right {
    overflow: hidden;
  }
  .van-swipe-cell__right p{
    position: absolute;
    top: 50%;
    left: 0;
    width: 5rem;
    height: 6rem;
    margin-top: -3rem;
    line-height: 6rem;
    font-size: 1.3rem;
    color: #FFFFFF;
    text-align: center;
    background: #FF6666;
  }
</style>
